<%@ page pageEncoding="UTF-8"%>
<%@ page import="java.util.*" %>
<%@ page import="com.hwhp.entity.Menu" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>菜单</title>
		<LINK href="<%=basePath %>css/milkwhite.css" type=TEXT/CSS rel=StyleSheet></LINK>
		<LINK href="<%=basePath %>/css/htmilkwhite.css" type=TEXT/CSS rel=StyleSheet></LINK>
<style type="text/css">
<!--
TD {
	FONT-SIZE: 12px; WORD-SPACING: 0px;COLOR: #000000; LINE-HEIGHT: 21px; FONT-FAMILY: "宋体"; LETTER-SPACING: 0px
}
A:link {
	COLOR: #666666; TEXT-DECORATION: none
}
A:visited {
	COLOR: #666666; TEXT-DECORATION: none
}
A:hover {
	COLOR: #cc3300; TEXT-DECORATION: none
}
A:active {
	COLOR: #666666; TEXT-DECORATION: none
}
A.Lwhite:link {
	COLOR: white; TEXT-DECORATION: none
}
A.Lwhite:visited {
	COLOR: white; TEXT-DECORATION: none
}
A.Lwhite:hover {
	COLOR: #fff962; TEXT-DECORATION: none
}
A.Lwhite:active {
	COLOR: white; TEXT-DECORATION: none
}
.headtd1 {  background: #00A4E1; border: 2px outset; border-color: #00BBFF #0077FF #0077FF #00BBFF; cursor: hand; font-size: 9pt}
.headtd2 {  background: #20C1FF; border: 2px outset; border-color: #60D3FF #0077FF #0077FF #60D3FF; cursor: hand; font-size: 9pt}
.bodytd  {  background: #dceeec; font-size: 9pt}
-->
</style>
		<script language="JavaScript">
var initDivIndex=1;
var bodyHeiht=736;
var titleHeiht=23;
var count=4;
var pace=6;
//获取div序号
function getDivIndex(obj){
var indexnumber = parseInt(obj.id.substr(4));
return indexnumber;
}
//获取td序号
function getTdIndex(obj){
var indexnumber = parseInt(obj.id.substr(4));
return indexnumber;
}
//根据td对象获取div对象
function getDivObjByTdObj(tdObj){
 var divIndex=getTdIndex(tdObj);
 var divId="item"+divIndex+"body";
 var divObj=document.getElementById(divId);
 return divObj;
}
//根据序号获取div对象
function getDivObjByIndex(index){
  var id="item"+index+"body";
  var divObj=document.getElementById(id);
  return divObj;
}
//获取div需要往上移动的像素
function getDivUpValue(divObj){
 var divIndex=getDivIndex(divObj);
 var divCourrentTop=parseInt(divObj.style.top);
 var upValue=divCourrentTop-(divIndex-1)*titleHeiht-12;
// alert(upValue);
 return upValue;
}
//获取div需要往下移动的像素
function getDivDownValue(divObj){
 var divIndex=getDivIndex(divObj);
 var divCourrentTop=parseInt(divObj.style.top);
 if(divIndex==1){
   divCourrentTop=divCourrentTop+12;
 }
 var upValue=bodyHeiht-(count-divIndex+1)*titleHeiht-divCourrentTop; 
// alert(upValue);
 return upValue;
}
//判断层移动方向
function getDivMoveWay(tdObj){
  var divObj=getDivObjByTdObj(tdObj);
  var currentIndex=getDivIndex(divObj);
  if(currentIndex<initDivIndex){
     return "down";
  }
  if(currentIndex==initDivIndex){
     return "notmove";
  }
  if(currentIndex>initDivIndex){
     return "up";
  }
}

function moveProcess(tdObj){
   var way=getDivMoveWay(tdObj);
     if(way=="up"){
          moveUp(tdObj);
    }else if(way=="down"){
          moveDown(tdObj);
        }else{
     }
}
//
function moveUp(tdObj){
var divObj=getDivObjByTdObj(tdObj);
var index=getDivIndex(divObj);
var moveValue=getDivUpValue(divObj);
for(var i=initDivIndex+1;i<=index;i++){
    var currentMove=getDivObjByIndex(i);
     currentMove.style.top=parseInt(currentMove.style.top)-moveValue;
}
  initDivIndex=index;
}
function moveDown(tdObj){
var divObj=getDivObjByTdObj(tdObj);
var index=getDivIndex(divObj);
var moveValue=getDivDownValue(divObj);
for(var i=index+1;i<=initDivIndex;i++){
    var currentMove=getDivObjByIndex(i);
    currentMove.style.top=parseInt(currentMove.style.top)+moveValue;
}
initDivIndex=index;
}


function returnValue(){
alert(document.getElementById("mainboard").clientHeight);
//alert(document.getElementById("item6body").style.top);
}
// -->
</script>
	</head>
	<%
	 List<Menu> menulist=(List<Menu>)request.getAttribute("menulist");
	 %>
	<body style="MARGIN: 0px;" scroll="no" id="body">
		<div id="mainboard" style="position:absolute; left:2px; top:0px; width:161px; height:100%; z-index:0; overflow: hidden; background: #0099FF;" onClick="">
		   <script language="JavaScript">
		    count=<%=menulist.size()%>
			bodyHeiht=document.getElementById("mainboard").clientHeight;
			function writeTitleStart(index,name){
			  var imgstr="<tr width='100%'><TD align='center'style='HEIGHT: 12px'  background='<%=basePath%>images/menus/index_r4_c2.jpg' colspan='3'></TD></tr>"
			  var divTop=0;
			  if(index==1){
			     divTop=0;
			  }else{
			     divTop=bodyHeiht-(count-index+1)*23;
			     imgstr="";
			  }
			  var str="<div id='item"+index+"body' style='position:absolute; left:0; top:"+divTop+"; width:100%; height:"+bodyHeiht+"px; z-index:1; overflow: hidden'>"
			         +"<table width='100%' border='0' height='100%' cellpadding='2' cellspacing='0' >"
			         +imgstr
			         +"<tr>"
			         +"<TD style='WIDTH: 1px' align='right' background='<%=basePath%>images/menus/index_r5_c2.jpg'></TD>"
			         +"<td id='item"+index+"head' height='23' style='background-image:url(<%=basePath%>images/menus/button_menu.jpg);width:147px;COLOR:#ffffff;LINE-HEIGHT:17px;font-size:9pt;cursor: hand;' onClick='moveProcess(this)'>"
			         +"<div align='center'>"
			         +name
			         +"</div>"
			         +"</td>"
			         +"<TD style='WIDTH: 5px' align='right' background='<%=basePath%>images/menus/index_r5_c8.jpg'></TD>"
			         +"</tr>"
			         +"<tr valign='top' align='center' >"
			         +" <TD style='WIDTH: 1px' align='right' background='<%=basePath%>images/menus/index_r5_c2.jpg'></TD>"
			         +"<td class='bodytd'>";
			         return str;
			}
			function writeSubMenu(name,targerurl,imgurl,title){
			   var str="<div id='KB1Parent' style='height:80px'>"
			         +"<a href='"
			         +targerurl
			         +"' onClick='expandIt();' class='text' target='mainFrame' title='"
			         +title
			         +"'>"
			         +"<IMG SRC='"
			         +imgurl
			         +"' BORDER=0>"
			         +"<br>"
			         +name
			         +"</a>"
			         +"</div>"
			       return str;
			}
			function writeTitleEnd(){
			     var str="</td><TD style='WIDTH: 5px' align='right' background='<%=basePath%>images/menus/index_r5_c8.jpg'></TD>"
			             +"</tr>"
			             +"</table>"
			             +"</div>";
			         return str;
			}
			<%
	       for(int n=0;n<menulist.size();n++){
	           Menu mainMenu=menulist.get(n);
	           String titlename=mainMenu.getName();
	           List<Menu> subMenuList=mainMenu.getSubList();
	        %>
	        document.write(writeTitleStart(<%=n+1%>,"<%=titlename%>"));
	        <%
	        for(int m=0;m<subMenuList.size();m++){
	           Menu subMenu=subMenuList.get(m);
	            String menuname=subMenu.getName();
	            String imageurl=basePath+subMenu.getImageUrl();
	            String href=basePath+subMenu.getUrl();
	            String title=subMenu.getRemark();
	            System.out.print("\n*******"+title);
	         %>
	        document.write(writeSubMenu("<%=menuname%>","<%=href%>","<%=imageurl%>",""));
	        <%
	        }
	        %>
	         document.write(writeTitleEnd());
	        <%
	     }
	  %>
			 </script>  
			</div><br><br></body>
</html>
